<html>

<body>
    <form id="J_form">
        <div>
            <label>姓名</label><input type="text" name="nickname" />
        </div>
        <div>
            <label>性别</label><input type="text" name="sex" />
        </div>
        <div>
            <label>哪里人</label><input type="text" name="province" />
        </div>
        <div>
            <button id="J_submit" type="button">提交</button>
        </div>
    </form>
</body>
<script>
    // 这种绑定方式不会被覆盖
    document.getElementById("J_submit").addEventListener("click", () => {
        var form = document.getElementById("J_form");
        const nickname = document.getElementsByName("nickname")[0].value;
        alert(`姓名是${nickname}`);
    })
</script>

</html>